<!DOCTYPE html>
<html lang="zh-cmn-Hans" class="wide wow-animation smoothscroll scrollTo">
  <head>
    {template "layouts","header"}
  </head>
  <body>
    <!-- Page-->
    <div class="page text-center">
      <!-- Page Header-->
      <header class="page-head">
        {template "layouts","navbar"}
      </header>
      {template "layouts","breadcrumb"}

      <!-- Page Content-->
      <main class="page-content section-85 section-sm-0">
        <!-- Departments-->
        <section>
          {pc:content action="lists" catid="$catid" num="4" siteid="$siteid" order="listorder DESC"}
          <div class="shell">
            {loop $data $r}
            <div class="range range-xs-center range-sm-{php echo ($n%2===0)?'right':'left'} offset-top-0">
              <div class="cell-xs-10 cell-sm-6 section-image-aside section-image-aside-{php echo ($n%2===0)?'left':'right'} text-center text-sm-left">
                <div style="background-image: url({$r['thumb']})" class="section-image-aside-img veil reveal-sm-block"></div>
                <div class="section-image-aside-body section-sm-bottom-66 section-sm-top-110 inset-md-{php echo ($n%2===0)?'left':'right'}-93">
                  <h3>{$r['title']}</h3>
                  <hr class="divider divider-lg hr-sm-left-2 bg-java">
                  <div class="offset-top-34 offset-md-top-60">
                    {$r['description']}
                  </div>
                  <div class="offset-top-30"><a href="{$r['url']}" class="btn btn-ellipse btn-java">了解更多</a></div>
                </div>
              </div>
            </div>
            {/loop}
          </div>
          {/pc}
        </section>
      </main>

      {template "layouts","footer"}
    </div>
    {template "layouts","global"}
    {template "layouts","javascript"}
  </body>
</html>
